@import "@/styles/variables.scss";
.container_page {
  height: 100% !important;
  overflow-y: auto !important;

  .tab {
    display: flex;

    & > view {
      transition: 0.2s;
      flex: 1;
    }
  }

  .header {
    margin-bottom: 40rpx;
    border-radius: 0 0 20rpx 20rpx;
    overflow: hidden;
    position: relative;

    .fixedPane {
      background: $OVERALL_SITUATION_BACKGROUND;
      position: fixed;
      width: 100%;
      height: 148rpx;
      z-index: 2;
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      .imgs {
        width: 484rpx;
        height: 148rpx;
        background-image: url("../../static/BG_header.png");
        background-size: cover;
        background-position: center 40%;
      }
    }

    .tab {
      margin-top: 146rpx;
      background: white;
      padding: 25rpx 0;

      & > view {
        width: 25%;
        text-align: center;

        image {
          width: 98rpx;
          height: 98rpx !important;
          margin: 0 auto;
          margin-bottom: 20rpx;
        }
      }
    }
  }

  .main {
    padding: 0 24rpx;

    .part {
      margin-bottom: 30rpx;

      // 标题
      .title {
        color: #333;
        font-weight: bold;
        font-size: 30rpx;
        display: flex;
        justify-content: space-between;
        align-content: center;
        margin-bottom: 34rpx;
        .titleLeft {
          font-weight: bold;
          font-size: 32rpx;
          color: $OVERALL_SITUATION_BACKGROUND;
          line-height: 36rpx;
          position: relative;
          display: inline-block;
          &::after {
            content: "";
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 10rpx;
            background-color: rgba(0, 110, 254, 0.17);
          }
        }

        // 标题 更多按钮装饰
        & > view:last-child {
          color: #999;
          font-size: 24rpx;

          &:after {
            content: "";
            background: url($uni-imgPrefix + "/home/decorate_more.png");
            display: inline-block;
            position: relative;
            height: 16rpx;
            width: 17rpx;
            margin-left: 14rpx;
            background-size: cover;
          }
        }
      }

      .card {
        border-radius: 20rpx;
        overflow: hidden;

        .tab {
          & > view {
            color: #666;
            display: flex;
            padding: 24rpx;
            align-content: center;
            background: rgb(244, 247, 255);

            image {
              width: 20%;
              margin-right: 14rpx;
            }

            & > view {
              flex: 1;

              & > view:first-child {
                font-size: 28rpx;
              }

              & > view:last-child {
                color: #666 !important;
                font-size: 18rpx;
              }
            }
          }

          .active {
            background-color: rgba(95, 140, 255, 0.07) !important;
            color: #333;
          }
        }

        .content_part {
          padding: 24rpx 0;
          background: white;

          & > view {
            color: #333;
            font-size: 24rpx;
            padding: 0 24rpx;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;

            &:not(:last-child) {
              margin-bottom: 20rpx;
            }

            &::before {
              content: "";
              margin-right: 14rpx;
              width: 14rpx;
              height: 14rpx;
              display: inline-block;
              background-size: cover;
              background-image: url($uni-imgPrefix + "/home/decorate_listMarker.png");
            }
          }
          &:nth-child(2n-1) {
            background-image: linear-gradient(to right, #EBFFF7, #ffffff);
          }
        }

        .redMarker > view::before {
          background-image: url($uni-imgPrefix + "/home/decorate_listMarker_red.png") !important;
        }
      }
    }
  }

  .footer {
    background-color: white;
    margin: 24rpx;
    border-radius: 20rpx;
    padding: 24rpx;
    text-align: center;
    line-height: 60rpx;
    color: #666;
  }
}
